import advListView from '$v/advList'

import {
  isLoginRequest
} from '../api/admin'

import {
  addAdvRequest,
  advListRequest,
  deleteAdvRequest,
  getUpdateDataRequest,
  updateAdvRequest
} from '../api/adv'


//封装一个获取所有广告列表的函数
const getAllAdvList = async (pageNo =1, everyNum = 3) => {
  //发送请求
  try {
    //一旦return 则当前函数返回一个promise实例 值为当前await的返回值
    return await advListRequest(pageNo, everyNum);
  } catch (e) {
    alert("查询出现异常" + e.message);
    //判断是否是权限异常
    if (!e.isLogin) {
      return router.go("/login");
    }
  }

}

export default async (req, res) => {
  //路由切换的时候验证登录
  try {
    await isLoginRequest();
  } catch (e) {
    //请求异常后提示用户
    alert("有异常" + e.message)

    //判断是否是权限异常
    if (!e.isLogin) {
      return router.go("/login");
    }
  }

  //调用获取adv列表的函数
  const {
    advList,
    pageCount
  } = await getAllAdvList()
  //根据数据渲染
  res.render(advListView({
    advList,
    pageCount
  }))



  document.onclick = async function (e) {
    //添加广告逻辑
    if (e.target.id === "adv-save") {
      //收集表单数据 使用FormData
      const myForm = new FormData(document.advForm);

      console.log(myForm.get("advTitle"));
      console.log(myForm.get("advType"));
      console.log(myForm.get("advOrder"));
      console.log(myForm.get("advPic"));

      if (!myForm.get("advTitle") || !myForm.get("advType") || !myForm.get("advOrder") || !myForm.get("advPic")) {
        return alert("添加的内容不能有空的！！！！")
      }

      //发送请求
      try {
        await addAdvRequest(myForm)
        alert("添加广告成功")
        //关闭添加广告的弹窗
        document.getElementById("addClose").click();

        //把预览的img隐藏
        const oPreImg = document.getElementById('preImg');
        oPreImg.style.display = "none"

        //清空表单
        document.advForm.reset();

        //重新渲染视图
        //调用获取adv列表的函数
        const advList = await getAllAdvList()
        //根据数据渲染
        res.render(advListView({
          advList
        }))
      } catch (e) {
        alert("添加广告异常" + e.message);
        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("addClose").click();
          return router.go("/login");
        }
      }
    }

    //删除广告逻辑
    if (e.target.nodeName === "BUTTON" && e.target.classList.contains("btn-delete")) {
      //获取按钮上保存的 当前数据的 _id
      const _id = e.target.dataset.id;
      // console.log(_id);
      try {
        await deleteAdvRequest(_id);
        alert("删除数据成功")

        //调用获取adv列表的函数
        const advList = await getAllAdvList()
        //根据数据渲染
        res.render(advListView({
          advList
        }))

      } catch (e) {
        alert("删除数据失败" + e.message)

        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("addClose").click();
          return router.go("/login");
        }
      }

    }

    //点击更新按钮弹窗获取数据的逻辑
    if (e.target.nodeName === "BUTTON" && e.target.classList.contains("btn-update")) {
      const _id = e.target.dataset.id;
      try {
        const updateData = await getUpdateDataRequest(_id);
        console.log(updateData);

        //把数据放入更新的窗口中
        // console.log(document.updateForm);
        document.updateForm.advTitle.value = updateData.advTitle;
        document.updateForm.advType.value = updateData.advType;
        document.updateForm.advOrder.value = updateData.advOrder;

        //给当前弹窗的更新按钮上添加一个自定义属性 保存当前数据的id  方便以后提交
        document.getElementById('adv-update').dataset.id = updateData._id;
      } catch (e) {
        alert("更新查询失败" + e.message)
      }

    }

    //点击更新逻辑
    if (e.target.id === "adv-update") {
      const _id = e.target.dataset.id;
      //收集表单数据 使用FormData
      const myForm = new FormData(document.updateForm);

      if (!myForm.get("advTitle") || !myForm.get("advType") || !myForm.get("advOrder") || !myForm.get("advPic")) {
        return alert("添加的内容不能有空的！！！！")
      }

      try {
        await updateAdvRequest(myForm, _id);
        console.log("更新成功");

        //重新渲染视图
        //调用获取adv列表的函数
        const advList = await getAllAdvList()
        //根据数据渲染
        res.render(advListView({
          advList
        }))

        //关闭添加广告的弹窗再跳转
        document.getElementById("updateClose").click();

        document.querySelector('.modal-backdrop').style.display = "none";

      } catch (e) {
        alert("更新广告异常" + e.message);
        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("updateClose").click();
          return router.go("/login");
        }
      }
    }

    //点击页码
    if (e.target.nodeName === "SPAN" && e.target.parentNode.id === "page") {
      //重新发送请求 并传入当前要加载的页码
      const pageNo = +e.target.dataset.pageno;
      const {
        advList,
        pageCount
      } = await getAllAdvList(pageNo)
      //根据数据渲染
      res.render(advListView({
        advList,
        pageCount
      }))
    }

  }

  document.onchange = function (e) {
    if (e.target.id === "advPic") {
      const reader = new FileReader();
      reader.readAsDataURL(e.target.files[0])
      reader.onload = function (e) {
        // console.log(e.target.result);
        //把当前的读取的base64格式 给到img
        const oPreImg = document.getElementById('preImg');
        oPreImg.src = e.target.result;
        oPreImg.style.display = "block"
      }
    }
  }
}